<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta content="width=device-width,initial-scale=1.0, user-scalable=no" name="viewport" />
    <meta content="yes" name=" apple-mobile-web-app-capable" />
    <meta content="no" name="apple-touch-fullscreen" />
    <meta content="black" name=" apple-mobile-web-app-status-bar-style" />
    <meta content="telephone=no" name="format-detection"/>
    <title>蓝色风格首页（移动端）</title>
    <script src="../js/base.min.js"></script>
    <link rel="stylesheet" href="../css/css.css"/>
    <link rel="stylesheet" href="//at.alicdn.com/t/font_945776_1s6gnl38ed9.css"/>
</head>
<body>

<header>
    <div flex="dir:top main:justify cross:buttom">
    <h1>新手注册福利</h1>
        <img src="../img/5000.png"/>
        <button>立即注册＞</button>
    </div>
</header>

<!--f1-->
<section class="MM f1">
    <ul flex="main:justify cross:center">
        <li flex="main:justify cross:center dir:top">
           <div class="box1" flex="main:center cross:center">
               <i class="iconfont icon-huiyuan"></i>
           </div>
            <p>会员专区</p>
        </li>
        <li flex="main:justify cross:center dir:top">
            <div class="box2" flex="main:center cross:center">
                <i class="iconfont icon-chuxuguan"></i>
            </div>
            <p>精选理财</p>
        </li>
        <li flex="main:justify cross:center dir:top">
            <div class="box3" flex="main:center cross:center">
                <i class="iconfont icon-licai"></i>
            </div>
            <p>理财助手</p>
        </li>
        <li flex="main:justify cross:center dir:top">
            <div class="box4" flex="main:center cross:center">
                <i class="iconfont icon-liwu"></i>
            </div>
            <p>推荐有礼</p>
        </li>
    </ul>

</section>

<!--f2-->
<section class="MM f2">
<div class="titt" flex="main:justify cross:buttom">
    <div class="kuai"></div>
    <h2>新人专享</h2>
</div>

<div class="gundong">
<!--7.5%-->

<div class="bt">

    <div class="up" flex="main:justify cross:buttom">

       <div class="bfb_left" flex="cross:buttom">
        <span class="bfb_01">7</span>
        <span class="bfb_02">.5%</span>
       </div>

        <div class="bfb_right">
         <p class="zt01">包图省心宝</p>
         <p class="zt02">锁定期90天</p>
         </div>

    </div>

    <div class="xian">
        <div class="left"></div>
    </div>

</div>


<!--8.5%-->

<div class="bt">

        <div class="up" flex="main:justify cross:buttom">

            <div class="bfb_left" flex="cross:buttom">
                <span class="bfb_01">8</span>
                <span class="bfb_02">.5%</span>
            </div>

            <div class="bfb_right">
                <p class="zt01">包图省心宝</p>
                <p class="zt02">锁定期90天</p>
            </div>

        </div>

        <div class="xian">
            <div class="left"></div>
        </div>

    </div>


<!--9.5%-->
<div class="bt">

        <div class="up" flex="main:justify cross:buttom">

            <div class="bfb_left" flex="cross:buttom">
                <span class="bfb_01">9</span>
                <span class="bfb_02">.5%</span>
            </div>

            <div class="bfb_right">
                <p class="zt01">包图省心宝</p>
                <p class="zt02">锁定期90天</p>
            </div>

        </div>

        <div class="xian">
            <div class="left"></div>
        </div>

    </div>

</div>

</section>

<section class="MM f3">
    <div class="titt" flex="main:justify cross:buttom">
        <div class="kuai"></div>
        <h2>精选理财</h2>
    </div>

    <div class="jjin" flex="cross:center">
        <div>基金</div>
        <div>一日存入  月月取息</div>

    </div>

<div class="tz" flex>
    <div class="tz_01">
        <div flex>
            <span class="span1">6</span>
            <span class="span2">.18%</span>
        </div>
        <p>七日年化收益率</p>
    </div>
    <div class="tz_02">
        <p>1000元起投  明星基金经理</p>
        <div class="xian">
            <div class="left"></div>
        </div>

    </div>
    <div class="tz_03" flex="dir:top cross:center">
        <button type="button">立即投资</button>
        <p>已投资700000万元</p>

    </div>

</div>


</section>

<!--底部-->
<footer>
<ul flex>
    <li class="ft01"  flex="main:center dir:top cross:center">
       <i class="iconfont icon-shouye"></i>
        <p>首页</p>
    </li>
    <li class="ft01" flex="main:center dir:top cross:center">
        <i class="iconfont icon-qianbao"></i>
        <p>理财</p>
    </li>
    <li class="ft01"flex="main:center dir:top cross:center">
        <i class="iconfont icon-qutouzi"></i>
        <p>投资</p>
    </li>
    <li class="ft01" flex="main:center dir:top cross:center">
        <i class="iconfont icon-ziyuan"></i>
        <p>我的</p>
    </li>
</ul>



</footer>

<script>
    document.body.addEventListener('touchstart', function (){});
</script>



</body>
</html>